// 实现简易 shallowReactive shallowRef
const shallowReactive = (v) => {
  return new Proxy(v, {
    get(target, key) {
      // console.log('收集依赖')
      return target[key]
    },
    set(target, key, val) {
      target[key] = val
      console.log('视图更新')
      return true
    }
  })
}

const shallowRef = (v) => {
  return shallowReactive({
    value: v
  })
}

let raw1 = {
  a: 'a',
  gf: {
    b: 'b',
    f: {
      c: 'c',
      s: {
        d: 'd'
      }
    }
  }
}

let state = shallowReactive(raw1)
state.a = 1
state.gf.b = 2
state.gf.f.c = 3
state.gf.f.s.d = 4

let raw2 = {
  a: 'a',
  gf: {
    b: 'b',
    f: {
      c: 'c',
      s: {
        d: 'd'
      }
    }
  }
}

let ref = shallowRef(raw2)

ref.value.a = 1
ref.value.gf.b = 2
ref.value.gf.f.c = 3
ref.value.gf.f.s.d = 4
ref.value = {
  a: 1,
  gf: {
    b: 2,
    f: {
      c: 3,
      s: {
        d: 4
      }
    }
  }
}